<template>
  <div class="content">
    <dc-header :icon="'icon-header-back'"
               :title="'修改角色名称'"

               :action-title="'保存'"
               @submit="_save"></dc-header>
    <div class="mt20 pt">
      <inputItem placeholder="输入角色名称"
                 type="text"
                 class="bg-white"
                 :maxLength = "15"
                 v-model="mdName.roleName"
                 name="姓名"
      />
    </div>
  </div>
</template>
<script>
  import header from '@/common/plugins/header';
  import inputItem from '@/common/plugins/input/inputItem.vue';
  import api from '../../common/api/member';
  import mintUi from '../../common/mintUi';
  export default {
    data () {
      return {
        mdName: this.$route.params ? this.$route.params : {}
      };
    },
    components: {
      'dc-header': header,
      'inputItem': inputItem

    },
    methods: {
      _save () {
        if (this.mdName.roleName && this.mdName.roleName.length < 16) {
          let data = {
            mdName: {
              roleName: this.mdName.roleName
            },
            roleId: this.mdName.roleCode
          };
          api.modifyRN(data).then(res => {
            mintUi.openToast('修改成功!');
            this.$router.push('/accessSet/' + this.mdName.roleCode + '/' + this.mdName.roleName);
          });
        } else {
          mintUi.openToast('请重新输入!');
        }
      }
    }
  };
</script>
<style lang="scss" scoped>
  @import "../../assets/css/variable";

  .pt {
    padding-top: px2rem(100px);
  }

  .mt20 {
    margin-top: px2rem(20px);
  }
</style>
